<template>
  <div class="Layouts jy-edit-style">
    <Heards />
    <div class="Layouts-content jy-style-height" v-show="store.tabvalue == 1">
      <router-view v-slot="{ Component }">
        <keep-alive>
          <component :is="Component" />
        </keep-alive>
      </router-view>
    </div>
    <div class="settingPlan-parent" v-show="store.tabvalue == 2">
      <settingPlan :level="2" />
    </div>
    <AddGroupExhibits v-if="store.addGroupExhibitsShow" />
    <AuxiliaryModel />
    <MoveAuxiliary />
    <messageModel
      submitText="删除"
      title="提示"
      :visible="store.delExbitShow"
      problem="确定删除此展品吗"
      message="后续可再次添加"
      @closeClick="closeClick"
      @submitClick="submitClick"
    />
    <messageModel
      submitText="删除"
      title="提示"
      :visible="store.delGroupShow"
      problem="确定删除此素材吗"
      message="素材内包含的展品后续可再次添加"
      @closeClick="closeClickGroup"
      @submitClick="submitClickGroup"
    />
    <AuxiliarySrot />
    <SortExbitionList />
    <ExhibitsDialog />
  </div>
</template> 
  
<script setup lang="ts">
import ExhibitsDialog from '@/freeComponents/exhibitsDialog/index.vue';

import { setAuthorization, getHeardToken, getHeardXtoken, setMd5Info, removeAuthorization } from '@/api/utils';

import SortExbitionList from '@/components/sortExbitionList/index.vue';
import AuxiliarySrot from '@/components/AuxiliarySrot/index.vue';
import messageModel from '@/components/messageModel/indexFree.vue';
import MoveAuxiliary from '@/components/moveAuxiliary/index.vue';
import Square from '@/pages/square/square.vue';
import AuxiliaryModel from '@/components/AuxiliaryModel/index.vue';
import AddGroupExhibits from '@/components/addGroupExhibits/index.vue';
import settingPlan from '@/pages/project/prijectMenu/plan.vue';
import { useProjectStore, commonDataStore, useUserStore } from '@/store';
import Heards from './Heards.vue';
import { ref } from 'vue';
import { getUrlTemplateId } from '@/utils/minxin';
import editPage from '@/pages/edit/index.vue';
import { overview, projectRole } from '@/api/project/project';
import { useRouter } from 'vue-router';

const router = useRouter();
const commonStore = commonDataStore();
const store = useProjectStore();
const userStore = useUserStore();

const initLogin = async () => {
  const token = getHeardToken();
  if (token) {
    await userStore.getUserInfo();
  } else {
    userStore.logout();
  }
};

const init = () => {
  let templateId: number = commonStore.getDigitalShowroom();
  if (!templateId) {
    router.push({
      name: 'templateSquare',
    });
  }
};
const getRole = async () => {
  try {
    let res = await projectRole(localStorage.getItem('projectId'));

    store.setProjectRole(res.data);
    // console.log();
  } catch {}
};
const submitClick = () => {
  store.removeExhibitsGroup(store.selectAuxiliaryIndex);
  store.delExbitShow = false;
};
const closeClick = () => {
  store.delExbitShow = false;
};
const closeClickGroup = () => {
  store.delGroupShow = false;
};
const submitClickGroup = () => {
  store.removeExhibitsGroup(store.selectAuxiliaryIndex);
  store.delGroupShow = false;
};

initLogin();
getRole();
getUrlTemplateId();
init();
store.getPreviewId(localStorage.getItem('projectId'));
</script>     
  
<style scoped lang="less">
.Layouts {
  display: flex;
  flex-direction: column;
  min-width: 100vw;
  height: 100vh;
  background: #f5f5f5;
  // overflow: hidden;
}
.Layouts-content {
  width: auto;
  margin-top: 48px;
}
.settingPlan-parent {
  width: 100vw;
  height: calc(100vh - 48px);
  margin-top: 48px;
}
.jy-edit-style {
  :deep(.jy-style-height) {
    height: calc(100vh - 48px);
  }
  //   :deep(.hovered){
  //   border-color: transparent !important;
  // }
}
//  :deep(.hovered){
//   border-color: transparent !important;
// }
</style>